<template>
  <div class="formTap">
    <div class="form-group formInput">
      <label for="username">task title</label>
      <input v-model="taskTitle" type="text" class="form-control" id="username" placeholder="task title">
    </div>
    <div class="form-group formInput">
      <label for="">content</label>
      <textarea v-model="taskContent" class="form-control" rows="3" placeholder="task content"></textarea>
    </div>
    <button type="submit" class="btn btn-primary" @click="submitTask">submit</button>
  </div>
</template>

<script setup lang="js">
import {ref} from "vue";
import {post} from "../plugin/api";

const taskTitle = ref();
const taskContent = ref('');

const submitTask = async () => {
  const baseUrl = "http://175.24.81.97:8093";

  const data = await post(`${baseUrl}/addtask`, {taskTitle: taskTitle.value, taskContent: taskContent.value});
  if(data){
    navigateTo('/todo');
  }
}

</script>

<style>
.formTap {
  margin: 20% auto;
  width: 80%;
}
</style>
